<?
            $p=$this->profile;
//            var_dump($p);die;
            $messages=$this->messages;
//            var_dump($messages);die;
            $friends=$this->friends;
//            var_dump($friends);die; 
//           $vCon=$this->venueController;
           // $like_url="https://graph.facebook.com/me/likes?access_token=".$p->getFb_account();

?>
<div style="width: 650px; top:500px; clear: both;" class="body" id="main">
	<div id="content">
		<article class="round_edge_10px block" id="main_post_box">
                 <p>What you want to say?</p>
                <textarea class="round_edge_5px" id="publish_editor" rows="" cols="" name="" accesskey="1" tabindex="1"
                          range="0&amp;0"></textarea>
                <button id="main_post_btn" onclick="try{ main_post_submit(); } catch (e) {alert(e);}">Post</button>
                <p>Where are you? <input type="text" id="location_ac" onfocus="initLAC();" onblur="destroyLAC();"  ><button>Select</button></p>
                <div id="location_selecter"></div>
		</article>
<? if ($messages!=null && sizeof($messages)>0){
    for($i=0;$i<sizeof($messages);$i++){
        $m=$messages[$i];
//        var_dump($m);die;
        ?>
        <article class="round_edge_10px block msg">
                    <input type="hidden" class="id_field1" value="<?=$m->getUser_id();?>"/>
                    <span class="post_time"><?=$m->getPublic_time(); ?></span>&nbsp;
                    <a href="" class="m_poster"><?=$m->getUser_name();?></a> said:
                <p class="m_post"><?=$m->getMessage_content();?></p>
                <p class="m_op">
                    <a class="m_venue_element"
                                  href="/venue?venue_id=<?=$m->getVenue_id();?>">
                        <?=$m->getVenue_name();?>
                    </a>
                    <a class="m_op_element" href="">Reply</a>
                </p>
          </article>
        <?
    }
}
else{
     ?> <article class="round_edge_10px block">
                  There is no messages.
      </article>
<?}
?>

	</div>
	<div id="sidebar">
	<aside id="description" class="round_edge_10px block">
                   <section>
                    <figure id="user_fig" class="">
                        <img width="100px" src="/images/default-image.png"/>
                        <div style="margin:2px; float:right; position: relative; left:-20px;">
                            <a href="" style="" id="user_name"><?=$p->name;?></a><br/>
                            <a id="user_college" style="font-size:70%; word-wrap:word-break;overflow:hidden;"><?=$p->university; ?></a>
                        </div>
                    </figure>
                    <p id="user_desc" style="float:none;">
                   You are in <a style="color:red"><?=$this->venue->getVenue_name();?></a>
                    </p>
                   </section>
	</aside>
        <aside id="featured1" name="fb" class="round_edge_10px block featured">
		
  	</aside>
        <aside id="featured3" name="friends" class="round_edge_10px block featured">
	<!--showing the recommendations-->
		<h4>Friends</h4>
               
                <?

                    for($i=0;$i<sizeof($friends);$i++){
                        $friend=$friends[$i];
                        if ($friend->getFounder_id()==$p->user_id){
                        ?>
                        <div class="friend_element">
                           <?= $friend->getTarget_name();?>
                        </div>
                        <?
                        }else{
                            ?>
                          <div class="friend_element">
                           <?= $friend->getFounder_name();?>
                        </div>

                            <?
                        }

                    }
                ?>
                                <a style="color:red; " onclick="confirmFriends()" >Unconfirmed Friends</a>
  	</aside>
	<!--end of featured recommendation-->
	</div>
        </div>
<script>
        
  var locationtemp;
  var selected=Array();
  selected['venue_name']="HKU";
  selected['venue_id']="1";
    function initLAC(){
      try{
//      alert(locations);
 $("#ac").autocomplete("destroy");
      $('#location_ac').autocomplete({
//          locations,
                    source:"/search/vac",
                    minLength:2,
                    focus:function(event,ui){
                        alert(ui.item);
                    },
                    select:function(event,ui){
                        selected=ui.item;
                        alert(ui.item);
                    }

                }).data( "autocomplete" )._renderItem = function( ul, item ) {
			return $( "<li></li>" )
				.data( "item.autocomplete", item )
				.append( "<a>" + item.name + "</a>" )
				.appendTo( ul );
		};
//                alert('autocomplete finished init!');
        }catch (e){alert(e);}
    }
                function main_post_submit(){
//                    alert("mp submit start.");
                    var content=$("#publish_editor").val();
                    if (!content){
                        alert("Please enter key in something before you post!");
                        return false;
                    }
                    //var uid= //$("#id_field").
//                    if (!selected){
//                        alert("Please enter/choose your location!");
//                        return false;
//                    }

                    $.post("/message/postmessage",
                    {'message_content':content,'venue_id':selected['venue_id'],'venue_name':selected['venue_name'],'message_id':'0'},
                        function(json_data){
                            alert(json_data.result);
                            },
                        'json');
//                    alert('mp submit ends.');

                }

                function destroyLAC(){
//                    $("#location_ac").autocomplete("destroy");
                }

                $(function(){
                    var like_content="<h4>What I like on Facebook</h4>";
                    var like_fb=eval('('+'<?=$this->like;?>'+')');
//                    alert('<?=$this->like;?>');
                    if (!like_fb.error){
                        for (i=0;i<(like_fb.data).length;i++){
                            like_content+="<a href=''>"+(like_fb.data)[i].name+"</a><br/>";
                        }
                    }
                    $('#featured1').append(like_content);
                });
        function confirmFriends(){
                var  me_con=" ";
                
        $( "#dialog:ui-dialog" ).dialog( "destroy" );
        $.get('/friends/unconfirmlist', '',
        function(data){
//            alert(data);
            for(var e in data) {
                me_con+="<button onclick='confirm("+e.founder_id+");'>";
                me_con+=e.founder_name+"</button>";
            }
//            alert('append:'+me_con);
            if (me_con!="")
                $("#me_confirm p").after(me_con);
            else $("#me_confirm p").after("<p>No request to confirm.</p>");
             $( "#me-confirm" ).dialog({
                resizable: false,
                height:200,
                modal: true,
                buttons: {
                        "OK": function() {
                            $( this ).dialog( "close" );
                        },
                        'Cancel': function() {
                                $( this ).dialog( "close" );
                        }
                }
        });
        }
        , 'json');

       
                }
function confirm(id){
        $.post("/friends/confirmfriends", {'friend_id':id}, function(data){
        alert(data);
        $("#button_"+id).remove();
        }, 'json');
}
var time;
$(function(){
//$('body').everyTime('5s',updateMessages);
time=setTimeout("updateMessages()",5000);
});
function updateMessages(){
    var msg_content="";
//alert('begin');
    $.get("/message/getmessagebyajax?venue_id=<?=$this->venue->getVenue_id();?>",'',function(data){
//        alert('success');
        for( var i=0; i<data.length; i++){
             msg_content+="<article class='round_edge_10px block msg'><input type='hidden' class='id_field1' value="+data[i].user_id+"/><span class='post_time'>"+data[i].public_time+"</span>&nbsp;<a href='' class='m_poster'>"+data[i].public_time+"</a> said:<p class='m_post'>"+data[i].message_content+"</p><p class='m_op'><a class='m_venue_element' href='/venue?venue_id="+data[i].venue_id+"'> "+data[i].venue_name+" </a> <a class='m_op_element' href=''>Reply</a> </p> </article>";
    }
//        alert(msg_content);

        $('.msg').remove();
        $('#content').append(msg_content);
//        alert('timeout to begin');
        time=setTimeout("updateMessages()",5);
        return;
    },'json');
}
</script>
<div id="me-confirm" title="Confirm friends" style="display:none;">
        <p>Do you want to befriend with them?</p>
</div>
